import React, { PropsWithChildren, useRef, useEffect } from "react";
import { Carousel } from "antd";
import "./index.less";
import Slider from "@/typings/slider";
type Props = PropsWithChildren<{
    children?: any,
    sliders?: Slider[],
    getSliders?: any,
}>;
function HomeSliders(props: Props) {
    useEffect(() => {
        if (props.sliders.length == 0) {
            props.getSliders();
        }
    }, []);
    return (
        <Carousel effect="scrollx" autoplay>
            {props.sliders.map((item: Slider, index: number) => (
                <div key={index}>
                    <img src={item.url} />
                </div>
            ))}
        </Carousel>
    );
}

export default HomeSliders;